<!DOCTYPE html>
<html class="no-js" lang="{{ DEFAULT_LANG }}">

<head>
    {% block head %}
    <title>{% block title %}{{ SITENAME }}{% endblock title %}</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
    <link rel="stylesheet" id="responsive-style-css"  href='{{ SiteProtoDomainTLD }}/theme/css/style.css' type="text/css" media="all" />
    <link rel="stylesheet" id="responsive-style-css"  href='{{ SiteProtoDomainTLD }}/theme/css/highlight.css' type="text/css" media="all" />
    <link rel="shortcut icon" type="image/x-icon" href='{{ SiteProtoDomainTLD }}/favicon.ico' />
    {% if FEED_ALL_ATOM %}
    <link href="{{ FEED_DOMAIN }}/{{ FEED_ALL_ATOM }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Full Atom Feed" />
    {% endif %}
    {% if FEED_ALL_RSS %}
    <link href="{{ FEED_DOMAIN }}/{{ FEED_ALL_RSS }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Full RSS Feed" />
    {% endif %}
    {% if FEED_ATOM %}
    <link href="{{ FEED_DOMAIN }}/{{ FEED_ATOM }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Atom Feed" />
    {% endif %}
    {% if FEED_RSS %}
    <link href="{{ FEED_DOMAIN }}/{{ FEED_RSS }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} RSS Feed" />
    {% endif %}
    {% if CATEGORY_FEED_ATOM and category %}
    <link href="{{ FEED_DOMAIN }}/{{ CATEGORY_FEED_ATOM|format(category.slug) }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Categories Atom Feed" />
    {% endif %}
    {% if CATEGORY_FEED_RSS and category %}
    <link href="{{ FEED_DOMAIN }}/{{ CATEGORY_FEED_RSS|format(category.slug) }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Categories RSS Feed" />
    {% endif %}
    {% if TAG_FEED_ATOM and tag %}
    <link href="{{ FEED_DOMAIN }}/{{ TAG_FEED_ATOM|format(tag.slug) }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Tags Atom Feed" />
    {% endif %}
    {% if TAG_FEED_RSS and tag %}
    <link href="{{ FEED_DOMAIN }}/{{ TAG_FEED_RSS|format(tag.slug) }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Tags RSS Feed" />
    {% endif %}
    
    {% endblock head %}
</head>

<body id="index" class="blog">
    <div id="container" class="hfeed">
	<header id="header">
            <div data-id="logo">
		<img src="{{ SiteProtoDomainTLD }}/extra/default-logo.png" alt="{{ SITENAME }}" style="margin: 0px auto; display: block;"/>
            </div>
            
	    <nav id="menu" class="main-nav">
		<ul class="menu">
		    <li><a href="{{ SiteProtoDomainTLD }}/">Home</a></li>
		    {% for title, link in MENUITEMS %}
		    <li{% if pg == PAGE %} class="active"{% endif %}>
			<a href="{{ link }}">{{ title }}</a>
		    </li>
		    {% endfor %}
		    {% if DISPLAY_PAGES_ON_MENU %}
		    {% for pg in pages %}
		    <li{% if pg == PAGE %} class="active"{% endif %}>
			<a href="{{ SiteProtoDomainTLD }}/{{ pg.url }}">{{ pg.title }}</a>
		    </li>
		    {% endfor %}
		    {% else %}
		    {% if DISPLAY_CATEGORIES_ON_MENU %}
		    {% for cat, null in categories %}
		    <li{% if cat == category %} class="active"{% endif %}>
			<a href="{{ SiteProtoDomainTLD }}/{{ cat.url }}">{{ cat }}</a>
		    </li>
		    {% endfor %}
		    {% endif %}
		    {% endif %}
		</ul>
	    </nav>
	    
	</header>
	<section id="wrapper" class="clearfix">
            <section id="content" class="grid col-620" >
		{% block content %}
                {% block content_title %}
                {% endblock %}
                <section class="breadcrumb-list">
                    {% block nav %}
                    {% endblock %}
                </section>

		{% endblock %}
            </section><!-- #content -->
            {% block widgets %}
            <section id="widgets" class="grid col-300 fit" >
		
		{% block categories %}
		<section id="widget-category" class="widget-wrapper widget_archive">
                    <div class="widget-title">
			Category
                    </div>
                    <ul>
			{% for category, article in categories%}
                        <li><a href="{{ SiteProtoDomainTLD }}/{{ category.url }}" >{{ category.name }} </a></li>
			{% endfor %}
                    </ul>
		</section>
		{% endblock %}

		{% block tagcloud %}
		<section id="widget-tagcloud" class="widget-wrapper widget_archive">
                    <div class="widget-title" data-comments="There is no cloud, only other computers.">
			Tags
                    </div>
                    <div>
			{% for tag, articles in tags %}
                        <span><a href="{{ SiteProtoDomainTLD }}/{{ tag.url }}">{{ tag.name }}</a></span>
			{% endfor %}
                    </div>
		</section>
		{% endblock %}


		{% block links %}
		<section id="widget-links" class="widget-wrapper widget_archive">
                    <div class="widget-title">
			Links
                    </div>
                    <ul>
			{% for name, link in LINKS %}
			<li><a href="{{ link }}">{{ name }}</a></li>
			{% endfor %}
			{% for name, link in SOCIAL %}
			<li><a href="{{ link }}">{{ name }}</a></li>
			{% endfor %}
                    </ul>
		</section>
		{% endblock %}
		
            </section><!-- widgets -->
            {% endblock widgets %}
	</section><!-- /#wrapper -->
	{% block footer %}
	<footer id="footer" class="clearfix"><section class="footer-wrapper">
            <div class="grid col-940" >
		<div class="grid col-540"></div>
		<div class="grid col-380 fit" >
                    <ul class="social-icons">
			<!-- TO BE CONTINUED -->
                    </ul>
		</div>
            </div>

            <div data-id="logo" class="">
		<img src="{{ SiteProtoDomainTLD }}/extra/avatar.png" alt="{{ SITENAME }}" style="margin: 0px auto; display: block; max-height: 480px;"/>
            </div>
            
            <div class="grid col-300 copyright" >
		<a href="https://creativecommons.org/licenses/by-sa/4.0/" rel="license">
                    CC-BY-SA 4.0
                    <!--<img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by-sa/4.0/88x31.png" />-->
		</a>
            </div>
            <div class="grid col-300 ">

            </div>
            <div class="grid col-300 fit powered">
		Powered by <a href="http://getpelican.com/">Pelican</a> <br />
		which takes great advantage of <a href="http://python.org">Python</a>
            </div>
            
            
	</section></footer>
	{% endblock footer %}
    </div>
</body>

</html>
